<div class="layuimini-container layuimini-page-anim">
    <div class="layuimini-main">
    <fieldset class="table-search-fieldset">
        <legend>操作</legend>
        <div style="margin: 10px 10px 20px 10px">
                <button class="layui-btn  layui-btn-sm " id="add" style="background: #2ecc71" > 新增 </button>
                <button class="layui-btn  layui-btn-sm " id="edit" style="background: #27ae60"> 修改 </button>
                <button class="layui-btn  layui-btn-sm " id="delete" style="background: #16a085"> 删除</button>
        </div>
    </fieldset>
    <ul id="institutionId" class="ztree"></ul>
    </div>
<!--    <input type="text" id="demo"  class="layui-input"/>-->
</div>
<script>
    layui.use(['form', 'table','miniPage','element','axios','ztree','selectOrg'], function () {
        var $ = layui.jquery,
            selectOrg = layui.selectOrg,
            form = layui.form,
            table = layui.table,
            axios = layui.axios,
            ztree = layui.ztree,
            miniPage = layui.miniPage;

        function loadTree() {
            function ajaxDataFilter(treeId, parentNode, responseData) {
                if (responseData) {
                    responseData=responseData.data.tree
                }
                console.log(responseData)
                return responseData;
            };
            var setting = {
                async: {
                    enable: true,
                    url:"/org/tree",
                    //接口返回设置成[]
                    dataFilter:ajaxDataFilter,
                    //传给后台的属性
                    autoParam: ["id"]
                },
                data:{
                    //处理接口接收数据属性不是默认的
                    simpleData: {
                        enable: true,
                        idKey: "id",
                        pIdKey: "parentId",
                        rootPId: 0
                    }
                }
            };

            ztree.init($("#institutionId"), setting);
        }
        loadTree();
        window.reload = function(){
            loadTree();
        }

        $('#add').click(function () {
            var content = miniPage.getHrefContent('org/add.html');
            var openWH = miniPage.getOpenWidthHeight();

            var index = layer.open({
                title: '添加组织',
                type: 1,//页面层
                shade: 0.2,
                maxmin:false,
                shadeClose: true,
                area: [openWH[0] + 'px', openWH[1] + 'px'],
                offset: [openWH[2] + 'px', openWH[3] + 'px'],
                content: content,
            });
            $(window).on("resize", function () {
                layer.full(index);
            });
        })
        $('#edit').click(function () {
            //获得当前选中id
            let treeObj = ztree.getZTreeObj("institutionId");
            let node  = treeObj.getSelectedNodes()[0];//注意得到的是对象数组 需要加[0]
            if(node) {

                console.log(node.id)
                var content = miniPage.getHrefContent('org/edit.html');
                var openWH = miniPage.getOpenWidthHeight();
                console.log("装载前")
                var index = layer.open({
                    title: '编辑组织',
                    type: 1,//页面层
                    shade: 0.2,
                    maxmin: false,
                    shadeClose: true,
                    area: [openWH[0] + 'px', openWH[1] + 'px'],
                    offset: [openWH[2] + 'px', openWH[3] + 'px'],
                    content: content,
                });
                //可以进行修改，因为数据库中删除了org表的gradeid字段
                axios.all([axios.get("grade/list"), axios.get("/org/one?id=" + node.id)])
                    .then(axios.spread(function (response1, response2) {
                        data = response1.data.grades
                        let options = '<option value="">请选择年级</option>';
                        for (let obj of data) {
                            options += '<option value="' + obj.id + '">' + obj.name + '</option>'
                        }
                        $('#gradeId').append(options);
                        form.render('select');//处理动态赋值
                        form.val("edit-org", {
                            id: response2.data.org.id,
                            name: response2.data.org.name,
                            parentId: response2.data.org.parentId,
                            //gradeId: response2.data.org.gradeId,
                            type: response2.data.org.type,
                            remark: response2.data.org.remark,
                        })
                        if (node.getParentNode() != null) {
                            $('#parentName').val(node.getParentNode().name)
                        }

                    })).catch(errors=>{
                      layer.msg("请求错误",{
                            icon:5,
                            time:2000,
                            anim:6
                          })
                    })
            }else{
                layer.msg("请选择数据编辑",{
                  icon:5,
                  time:2000,
                  anim:6
                })
            }
            $(window).on("resize", function () {
                layer.full(index);
            });
        })
        $('#delete').click(function () {
            let treeObj = ztree.getZTreeObj("institutionId");
            let node  = treeObj.getSelectedNodes()[0];//注意得到的是对象数组 需要加[0]
            if(node){
                layer.confirm('真的要删除吗？', function (index) {
                    axios.delete("org/deleteOne/"+node.id)
                        .then(data=>{
                            if(data.code==0){
                              layer.msg(data.message,{
                                icon:6,
                                time:2000
                              },function () {
                                  window.reload()
                              })
                            }else{
                              layer.msg(data.message,{
                                icon:5,
                                time:2000,
                                anim:6
                              })
                            }
                        }).catch(error=>{
                          layer.msg("请求错误",{
                            icon:5,
                            time:2000,
                            anim:6
                          })
                        });
                });
            }else{
                layer.msg("请选择数据删除",{
                  icon:5,
                  time:2000,
                  anim:6
                })
            }
        })
    });


</script>